<template>
  <div class="app-container">
    <div class="btnBox">
      <el-card shadow="hover">
        <div class="btnImg" @click="handleOk('line')">
          <img src="../../assets/DashboardBg/doshBoard1.jpg" alt="" style="width:100%">
        </div>
      </el-card>
      <el-card shadow="hover">
        <div class="btnImg" @click="handleOk('product')">
          <img src="../../assets/DashboardBg/doshBoard2.jpg" alt="" style="width:100%">
        </div>
      </el-card>
    </div>
  </div>
</template>

<script>

export default {
  name: 'LineDashboard',
  data() {
    return {
      listQuery: {
        page: 1,
        limit: 20,
        state: 0,
        lineNumber: '',
        stationNumber: '',
        alarmType: '',
        startTime: '',
        endTime: '',
        sort: '+processNumber'
      },
      src: '../../assets/DashboardBg/doshBoard1.jpg'
    }
  },
  created() {
    this.listQuery.lineNumber = this.$store.getters.lineNumber
  },
  methods: {
    handleOk(data) {
      if (data === 'line') {
        this.$router.push({ path: '/lineView', query: { lineNumber: this.listQuery.lineNumber }})
      } else {
        this.$router.push({ path: '/productView', query: { lineNumber: this.listQuery.lineNumber }})
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.btnBox{
  height: 80vh;
  display: flex;
  justify-content:space-around;
  align-items: center;
}
.btnImg{
  width: 500px;
  height: 100%;
  border-radius: 10px;
}
</style>
